<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Amaze UI Admin index Examples</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" th:href="@{/assets/i/favicon.png}">
    <link rel="apple-touch-icon-precomposed" th:href="@{/assets/i/app-icon72x72.png}">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" th:href="@{/assets/css/amazeui.min.css}" />
    <link rel="stylesheet" th:href="@{/assets/css/admin.css}">
    <link rel="stylesheet" th:href="@{/assets/css/app.css}">
    <script th:src="@{/assets/js/echarts.min.js}"></script>
    <script th:src="@{/assets/js/jquery.min.js}"></script>
    <script th:src="@{/assets/js/amazeui.min.js}"></script>
    <script th:src="@{/assets/js/iscroll.js}"></script>
    <script th:src="@{/assets/js/app.js}"></script>
</head>
<body>
<div style="margin: 0px 35%">
    <form class="am-form am-form-horizontal"  style="width: 200px" id="form">
        <div class="am-form-group">
            <label class="col-sm-2 am-form-label">名字</label>
            <div class="col-sm-10">
                <input type="text" name="name" th:value="${userInfo.name}">
                <input type="hidden" name="id" th:value="${userInfo.id}">
            </div>
        </div>

        <div class="am-form-group">
            <label class="col-sm-2 am-form-label">头像</label>
            <div class="col-sm-10">
                <img th:src="@{${userInfo.url}}" width="50px">
                <input type="file" name="file">
            </div>
       </div>

        <div class="am-form-group am-form-select">
            <label class="col-sm-2 am-form-label">所属部门</label><span th:text="${userInfo.department.departmentName}"></span>
            <select class=" am-input-sm" name="department" id="department">
                <option th:selected="${userInfo.department.departmentName eq department.departmentName}" th:each="department : ${departments}" th:text="${department.departmentName}" th:value="${department.id}">
            </select>
        </div>

        <div class="am-form-group am-form-select">
            <label class="col-sm-2 am-form-label">是否担任管理员</label>
            <select class=" am-input-sm" name="administrator">
                <option value="是">是</option>
                <option value="否">否</option>
            </select>
        </div>

        <div class="am-form-group">
            <div class="col-sm-offset-2 col-sm-10" style="text-align: center">
                <button type="button" class="am-btn am-btn-primary" id="up">提交</button>
            </div>
        </div>
    </form>
</div>
<script  th:inline="javascript">
    $("#up").click(function () {
        var form = new FormData(document.getElementById("form"));
        $.ajax({
            url: '/update',
            method: 'post',
            processData: false, // 告诉jquery要传输data对象
            contentType: false,   // 告诉jquery不需要增加请求头对于contentType的设置
            data: form,
            success: function (rs) {
                if (rs === "ok") {
                    parent.layer.msg("修改成功!", {shade: 0.3}, function () {
                        parent.refresh();
                        parent.layer.closeAll();
                    });
                }
            }
        })
    })
</script>
</body>
</html>
